<head>
	<script type="text/javascript">
		var aJaxURL		= "server-side/report/records_offis.action.php";
		var aJaxURL1	= "server-side/report/records1_offis.action.php";
		var aJaxURL2	= "server-side/report/records2_offis.action.php";	//server side folder url
		var tName	= "example";
		var tbName		= "tabs";											//table name
		
		$(document).ready(function () {
			GetDate("search_start_my");
    		GetDate("search_end_my");
			GetTabs(tbName); 
			LoadTable();
		});
		$(document).on("tabsactivate", "#tabs", function() {
        	var tab = GetSelectedTab(tbName);
        	if (tab == 0) {
        		LoadTable();
        		GetDate("search_start_my");
        		GetDate("search_end_my");
         	}else if(tab == 1){
         		LoadTable1();
         		GetDate("search_start_my1");
         		GetDate("search_end_my1");
            }
         	else if(tab == 2){
         		LoadTable2();
         		GetDate("search_start_my2");
         		GetDate("search_end_my2");
          	}
        });

		function LoadTable(){
			/* Table ID, aJaxURL, Action, Colum Number, Custom Request, Hidden Colum, Menu Array */
			var start	= $("#search_start_my").val();
	    	var end		= $("#search_end_my").val();
			/* Table ID, aJaxURL, Action, Colum Number, Custom Request, Hidden Colum, Menu Array */
			GetDataTable(tName, aJaxURL, "get_list",8, "start=" + start + "&end=" + end, 0, "", 1, "desc");
		}
		function LoadTable1(){
			/* Table ID, aJaxURL, Action, Colum Number, Custom Request, Hidden Colum, Menu Array */
			var start	= $("#search_start_my1").val();
	    	var end		= $("#search_end_my1").val();
			/* Table ID, aJaxURL, Action, Colum Number, Custom Request, Hidden Colum, Menu Array */
			GetDataTable("example1", aJaxURL1, "get_list",6, "start=" + start + "&end=" + end, 0, "", 1, "desc");
		}
		function LoadTable2(){
			/* Table ID, aJaxURL, Action, Colum Number, Custom Request, Hidden Colum, Menu Array */
			var start	= $("#search_start_my2").val();
	    	var end		= $("#search_end_my2").val();
			/* Table ID, aJaxURL, Action, Colum Number, Custom Request, Hidden Colum, Menu Array */
			GetDataTable("example2", aJaxURL2, "get_list",6, "start=" + start + "&end=" + end, 0, "", 1, "desc");
		}
			

		
		var record;
		function play(record){
			
			
			link = 'http://10.0.18.18:8080/' + record;
			GetDialog("audio_dialog", "auto", "auto","" );
			$(".ui-dialog-buttonpane").html(" ");
			$( ".ui-dialog-buttonpane" ).removeClass( "ui-widget-content ui-helper-clearfix ui-dialog-buttonpane" );
			$("#audio_dialog").html('<audio controls autoplay style="width:500px; min-height: 33px;"><source src="'+link+'" type="audio/wav"> Your browser does not support the audio element.</audio>');
	        
            
		}
		$(document).on("change", "#search_start_my", function () {
	    	var start	= $(this).val();
	    	var end		= $("#search_end_my").val();
	    	LoadTable(start, end, status);
	    });
	    
	    $(document).on("change", "#search_end_my", function () {
	    	var start	= $("#search_start_my").val();
	    	var end		= $(this).val();
	    	LoadTable(start, end, status);
	    });
	    $(document).on("change", "#search_start_my1", function () {
	    	var start	= $(this).val();
	    	var end		= $("#search_end_my1").val();
	    	LoadTable1(start, end, status);
	    });
	    
	    $(document).on("change", "#search_end_my1", function () {
	    	var start	= $("#search_start_my1").val();
	    	var end		= $(this).val();
	    	LoadTable1(start, end, status);
	    });
	    $(document).on("change", "#search_start_my2", function () {
	    	var start	= $(this).val();
	    	var end		= $("#search_end_my2").val();
	    	LoadTable2(start, end, status);
	    });
	    
	    $(document).on("change", "#search_end_my2", function () {
	    	var start	= $("#search_start_my2").val();
	    	var end		= $(this).val();
	    	LoadTable2(start, end, status);
	    });
	    
    </script>
</head>

<body>
<div id="tabs" style="width: 99%; margin: 0 auto; min-height: 768px; margin-top: 25px;">
   
    	<ul>
			<li><a href="#tab-0">შემომავალი ზარები</a></li>
			<li style="display: none;"><a href="#tab-1">გამავალი ზარები</a></li>
			<li style="display: none;"><a href="#tab-2">ყველა</a></li>
		</ul>
	
		<div id="tab-0">
        <div id="container"style="width: 99%;">        	
            <div id="dynamic">
            	<h2 align="center">ოფისის შემომავალი ზარები</h2>
            	<div id="button_area" style="margin-top: 40px;">
            	<div class="left" style="width: 250px;">
	            		<label for="search_start_my" class="left" style="margin: 5px 0 0 9px;">დასაწყისი</label>
	            		<input style="width: 150px; margin-left: 5px; height: 18px;"  type="text" name="search_start_my" id="search_start_my" class="inpt left"/>
	            	</div>
	            	<div class="right" style="">
	            		<label for="search_end_my" class="left" style="margin: 5px 0 0 9px;">დასასრული</label>
	            		<input style="width: 150px; margin-left: 5px; height: 18px;"  type="text" name="search_end_my" id="search_end_my" class="inpt right" />
            		</div>
            	</div>		
                <table class="display" id="example" style="width: 100%;">
                    <thead>
                        <tr id="datatable_header">
                            <th>ID</th>
                            <th style="width:  50%">თარიღი</th>
                            <th style="width:  50%">ტელეფონი</th>
                            <th style="width:  50%">კატეგორია</th>
                            <th style="width:  50%">ზარის ტიპი</th>
                            <th style="width:  50%">ბიზნეს ცენტრი</th>
                            <th style="width:  50%">შინაარსი</th>
                            <th style="width:  50%">ავტორი</th>
                        </tr>
                    </thead>
                    <thead>
                        <tr class="search_header">
                            <th class="colum_hidden">
                            	<input type="text" name="search_id" value="ფილტრი" class="search_init" style=""/>
                            </th>
                            <th>
                            	<input type="text" name="search_number" value="ფილტრი" class="search_init" style="width:80px;"></th>
                            <th>
                                <input type="text" name="search_date" value="ფილტრი" class="search_init" style="width:80px;"/>
                            </th>
                            <th>
                                <input type="text" name="search_phone" value="ფილტრი" class="search_init" style="width: 80px;"/>
                            </th>
                             <th>
                                <input type="text" name="search_category" value="ფილტრი" class="search_init" style="width: 80px;" />
                            </th>
                             <th>
                                <input type="text" name="search_category" value="ფილტრი" class="search_init" style="width:80px;" />
                            </th>
                             <th>
                                <input type="text" name="search_category" value="ფილტრი" class="search_init" style="width: 80px;" />
                            </th>
                             <th>
                                <input type="text" name="search_category" value="ფილტრი" class="search_init" style="width: 80px;" />
                            </th>
                        </tr>
                    </thead>
                </table>
            </div>
            <div class="spacer">
            </div>
          </div> 
          </div>
          <div id="tab-1" style="display: none;">
        <div id="container"style="width: 99%;">        	
            <div id="dynamic">
            	<h2 align="center">ოფისის გამავალი ზარები</h2>
            	<div id="button_area" style="margin-top: 40px;">
            	<div class="left" style="width: 250px;">
	            		<label for="search_start_my" class="left" style="margin: 5px 0 0 9px;">დასაწყისი</label>
	            		<input style="width: 150px; margin-left: 5px; height: 18px;"  value="<?php echo date('Y/m/d')." 00:00:00";?>" type="text" name="search_start_my" id="search_start_my1" class="inpt left"/>
	            	</div>
	            	<div class="right" style="">
	            		<label for="search_end_my" class="left" style="margin: 5px 0 0 9px;">დასასრული</label>
	            		<input style="width: 150px; margin-left: 5px; height: 18px;" value="<?php echo  date('Y/m/d H:i:s'); ?>" type="text" name="search_end_my" id="search_end_my1" class="inpt right" />
            		</div>
            	</div>		
                <table class="display" id="example1">
                <thead>
                        <tr id="datatable_header">
                            <th>ID</th>
                            <th style="width: 100%;">თარიღი</th>
                            <th style="width: 120px;">წყარო</th>
                            <th style="width: 120px;">ადრესატი</th>
                            <th style="width: 120px;">დრო</th>
                            <th style="width: 100%;">ქმედება</th>
                        </tr>
                    </thead>
                    <thead>
                        <tr class="search_header">
                            <th class="colum_hidden">
                            	<input type="text" name="search_id" value="ფილტრი" class="search_init" style=""/>
                            </th>
                            <th>
                            	<input type="text" name="search_number" value="ფილტრი" class="search_init hidden-input" style=""></th>
                            <th>
                                <input type="text" name="search_date" value="ფილტრი" class="search_init" style="width: 100px;"/>
                            </th>                            
                            <th>
                                <input type="text" name="search_category" value="ფილტრი" class="search_init" style="width: 80px;" />
                            </th>
                            <th>
                                <input type="text" name="search_phone" value="ფილტრი" class="search_init" style="width: 90px;"/>
                            </th>
                            <th>
                                <input type="text" name="search_category" value="ფილტრი" class="search_init" style="width: 90px;" />
                            </th>
                            
                        </tr>
                    </thead>
                </table>
            </div>
            <div class="spacer">
            </div>
          </div>
           </div>
          <div id="tab-2" style="display: none;">
        <div id="container"style="width: 99%;">        	
            <div id="dynamic">
            	<h2 align="center">ოფისის ყველა ზარი</h2>
            	<div id="button_area" style="margin-top: 40px;">
            	<div class="left" style="width: 250px;">
	            		<label for="search_start_my" class="left" style="margin: 5px 0 0 9px;">დასაწყისი</label>
	            		<input style="width: 150px; margin-left: 5px; height: 18px;" value="<?php echo date('Y/m/d')." 00:00:00";?>" type="text" name="search_start_my" id="search_start_my2" class="inpt left"/>
	            	</div>
	            	<div class="right" style="">
	            		<label for="search_end_my" class="left" style="margin: 5px 0 0 9px;">დასასრული</label>
	            		<input style="width: 150px; margin-left: 5px; height: 18px;" value="<?php echo  date('Y/m/d H:i:s'); ?>" type="text" name="search_end_my" id="search_end_my2" class="inpt right" />
            		</div>
            	</div>		
                <table class="display" id="example2">
                <thead>
                        <tr id="datatable_header">
                            <th>ID</th>
                            <th style="width: 100%;">თარიღი</th>
                             <th style="width: 120px;">წყარო</th>
                            <th style="width: 120px;">ადრესატი</th>
                            <th style="width: 120px;">დრო</th>
                            <th style="width: 100%;">ქმედება</th>
                        </tr>
                    </thead>
                    <thead>
                        <tr class="search_header">
                            <th class="colum_hidden">
                            	<input type="text" name="search_id" value="ფილტრი" class="search_init" style=""/>
                            </th>
                            <th>
                            	<input type="text" name="search_number" value="ფილტრი" class="search_init hidden-input" style=""></th>
                            <th>
                                <input type="text" name="search_date" value="ფილტრი" class="search_init" style="width: 100px;"/>
                            </th>                            
                            <th>
                                <input type="text" name="search_category" value="ფილტრი" class="search_init" style="width: 80px;" />
                            </th>
                            <th>
                                <input type="text" name="search_phone" value="ფილტრი" class="search_init" style="width: 90px;"/>
                            </th>
                            <th>
                                <input type="text" name="search_category" value="ფილტრი" class="search_init" style="width: 90px;" />
                            </th>
                            
                        </tr>
                    </thead>
                </table>
            </div>
            <div class="spacer">
            </div>
            </div>
          </div>
        </div>
        <!-- jQuery Dialog -->
	<div id="audio_dialog" title="ჩანაწერი">
	</div>
</body>